<script setup lang="ts">
import { ref, toRefs,reactive,defineProps, Prop } from 'vue'
import  { useRouter } from 'vue-router'
interface Props{
    data:any,
    yezujian:any
}

const props = withDefaults(defineProps<Props>(), {
    data:[],
    yezujian:[]
})
const route = useRouter();
const gotodetial= (item:String) => {
    console.log("info",props.data.name)
    switch(props.data.name){
        case "专业建设":
             route.push({
            path:`/subject?name=${item}`
        })
        break;
        case "教改项目":
             route.push({
            path:`/detials?name=${item}`
        })
        break;
        case "课程建设":
            route.push({
            path:`/course?name=${item}`
        })
        break;
        default:
            break
    }
    
}

</script>

<template>
    <div class="rightinfo" v-for="item in data.info">
      <span class="yuandian"></span> 
      <span class="righttitle" @click="gotodetial(item)">{{item}}</span>
    </div>
</template>

<style scoped>
.rightinfo{
    font-size: 14px;
    padding: 20px;
    text-indent: 28px;
    width: 95%;
    height: 35px;
    margin: 0 auto;
    line-height: 35px;
    display: flex;
    align-items: center;
}
.yuandian{
    height: 10px;
    width: 10px;
    background: black;
    border-radius: 50%;
}
.righttitle{
    margin-left: -20px;
    cursor:pointer;
    font-size: 15px;
}

</style>
